<template>
    <view class="box">
        <view style="color: #D84D23;text-align: center;">
            <image style="width: 65rpx;" mode="widthFix" src="/static/in_fuli/2.png"></image>
            <text style="font-size: 32rpx;font-weight: bold;margin: 0 30rpx 0 30rpx;">{{name}}</text>
            <image style="width: 65rpx;" mode="widthFix" src="/static/in_fuli/2.png"></image>
        </view>
        <view style="height: 20rpx;"></view>
        <view v-for="(item, index) in bodyData">
            <image
                style="width: 100%;" mode="widthFix" :src="item.prizeImg"></image>

        </view>
    </view>
</template>

<script>
export default {
    props:{
        activity:{
            type: Object,
            default: {}
        },
        name:{
            type: String,
            default: ''
        }
    },
    data() {
        return {
            imgUrl: 'https://img.yzcdn.cn/vant/cat.jpeg',
            bodyData: [{
                "activityId": 1, //活动id
                "createTime": "2023-03-21 16:48:46", //创建时间
                "id": 1, //奖品id
                "level": 0, //奖品等级
                "prizeImg": "", //奖品图片
                "prizeName": "华为手机", //奖品名称
                "status": 0, //状态 0未领取 1已领取
                "userId": 0 //中奖用户id
            }]
        }
    },
    
    methods: {
        getBodyData() {
            this.$kt.request.request({
                api: this.$api.taskActivity.getActivityPrize,
                data: {
                    activityId: this.activity.id
                },
                stateSuccess: (res) => {
                    this.bodyData = res.data;
                }
            })
        }
    },
    watch: {
        activity: {
            handler: function (val, oldVal) {
                this.getBodyData()
            },
            deep: true,
            immediate: true
        },
        
    },
}
</script>

<style lang="scss" scoped>
.box {
    padding: 30rpx;
    box-sizing: border-box;
    background-color: #ffffff;
    border-radius: 0 0 30rpx 30rpx;
}

.image {
    width: 100%;
    height: 100%;
    border-radius: 0 0 0rpx 30rpx;
}
</style>


